<!DOCTYPE html>
<html>

<head>
    <title>国产ChatGPT免费版 支持语音朗读</title>
    <meta charset="UTF-8" name="viewport"
        content="width=device-width,initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0,user-scalable=no" />
    <link rel="stylesheet" href="../static/styles.css">
    <link rel="shortcut icon" href="../static/favicon.ico" />
    <script type="text/javascript" src="../static/chat.js"></script>
    <script type="text/javascript" src="../static/record.js"></script>
    <script src="https://cdn.tailwindcss.com"></script>
</head>

<body>
    <div id="header">
        <div style="margin: 0px;">
            <p style="font-size: larger;">国产免费 ChatGPT</p>
        </div>
        <!-- <p>UID: <span id="ws-id"></span></p> -->
        <p style="font-size: small;" class="state"><span id="ws_status">连接已断开</span></p>
    </div>
    <audio id="audio-player" src="../static/audio/welcome.mp3" type="audio/mpeg">
    </audio>
    <div id="chat-container">
        <!-- <div class="bot-message">BOT: 哥，你可以问我任何问题哦～</div> -->
    </div>

    <div id="input-container">
        <input type="text" id="user-input" />
    </div>
    <div id="button-container">
        <button class="mt-4 text-white bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg w-full sm:w-auto px-5 py-2.5 text-center dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800"
         onclick="sendMessage()">发送</button>
         <!-- <span style="display: inline-block; width: 10px;"></span>
        <button class="mt-4 text-white bg-red-700 hover:bg-red-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg w-full sm:w-auto px-5 py-2.5 text-center dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-800"
         id="Record">录制音频</button> -->
         <label id="resultLabel"></label>
    </div>
    <span style="display: inline-block; height: 15px;"></span>
    <div style="display: flex;justify-content: space-between;">
        <div style="margin-left: 20px;">
            <input type="checkbox" id="google-news-control" value="" />
            <label for="google-news-control">开启新闻搜寻模式？</label>
        </div>
    </div>
    <div style="display: flex;justify-content: space-between;">
        <div style="margin-left: 20px;">
            <input type="checkbox" id="audio-control" value="" />
            <label for="audio-control">是否开启语音自动朗读？</label>
        </div>
    </div>

    <div style="text-align: center;">
        <div style="height: 30px;"></div>
        <p>Copyright 2023 ? xxx.com</p>
    </div>
</body>

</html>
